<template>
	<view>
		<view class="topbox">
			<view class="topbox1">
				<view class="">我的余额（元）</view>
				<view class="top2">￥{{money}} ></view>
				<view class="">可提现{{money}}元</view>
			</view>
			<view class="topbox2" @click="toPage(1)">去提现</view>
		</view>
		<view class="teb1">
			<!-- teb栏 -->
			<view  @click="shop" class="nav">
				 <img src="http://www.yuebi.online/images/eb5a66a1-fd9b-4ea4-bd04-48e7ac2e3842.png" alt="" class="img1  img2">
				 <view class="">实时销量</view>
			</view>
			<view  @click="toPage(2)" class="nav">
				<img src="http://www.yuebi.online/images/63e7a49f-1695-4102-b177-ed1a005a912a.png" alt="" class="img1 img2">
				 <view class="">提现记录</view>
			</view>
			<view  @click="toPage(3)" class="nav">
				 <img src="http://www.yuebi.online/images/6ab3c2ac-fd50-4012-aa4a-9b6021372f3f.png" alt="" class="img1 img4">
				<view class="">店铺信息</view>
			</view>
			<view  @click="outLogin()" class="nav">
				 <img src="http://www.yuebi.online/images/c6e6ea5a-4a37-40c0-8ca2-32f6737d513f.png" alt="" class="img1 img4">
				<view class="">退出登录</view>
			</view>
			<view  @click="outLogin" class="nav">
				 <img src="http://www.yuebi.online/images/16c2b6cc-1685-44b4-8ffb-058159537a68.png" alt="" class="img1 img5">
				<view class="">注销店铺</view>
			</view>
		</view>
	
		<TabBar currentPage="my"></TabBar>
	</view>
</template>

<script>
	import TabBar from '@/pages/common/components/TabBar.vue'
	import { queryStoreAcb, } from '@/api/new.js'
	import {mapMutations,mapState} from 'vuex'
	export default {
		data() {
			return {
				money:''
			}
		},
		components: {
			TabBar
		},
		computed: {
			...mapState({
				loginStatus: state => state.user.loginStatus,
				userInfo: state => state.user.userInfo
			})
		},
		onLoad() {
			this.getStoreAcb()
		},
		methods: {
			...mapMutations(['loginOut']),
			shop() {
				uni.navigateTo({
				    url: '/pages/my/Histogram'
				});
			},
			getStoreAcb(){
				var data1 = {
					storeId:this.userInfo.storeId
				}
				queryStoreAcb(data1).then(res => {
					this.money = res.data.data
				})
			},
			toPage(i){
				if(i==1){
					uni.navigateTo({
					    url: '/pages/detail/index'
					});
				}else if(i==2){
					uni.navigateTo({
					    url: '/pages/my-order/index'
					});
				}else if(i==3){
					uni.navigateTo({
					    url: '/pages/service/StoreInformation'
					});
				}
			},
			outLogin(){
				uni.showToast({
					title:"退出成功",
					icon:"none"
				})
				this.loginOut();
				uni.reLaunch({
					url:"../index/index"
				})
			}
		}
	}
</script>

<style scoped>
	.topbox{
		display: flex;
		background: #3e72e1;
		color: aliceblue;
		height: 300rpx;
		width: 92%;
		margin: 4%;
		border-radius: 20rpx;
	}
	.topbox1{
		width: 56%;
		color: #fff;
		margin-left: 60rpx;
		margin-top: 70rpx;
		font-size: 26rpx
	}
	.top2{
		font-size: 54rpx !important;
		font-weight: 600;
		line-height: 80rpx;
		margin-bottom: 20rpx;
		margin-left: -10rpx;
	}
	.topbox2{
		margin-top: 100rpx;
		background: #fff;
		width: 200rpx !important;
		height: 100rpx;
		line-height: 100rpx;
		border-radius: 50rpx;
		font-weight: 600;
		font-size: 36rpx;
		color: #3e72e1;
		text-align: center;
	}
	.teb1{
		padding: 0 3%;
		display: flex;
		flex-wrap: wrap;
		align-content: stretch;
	}
	.nav{
		margin-top: 20rpx;
		width: 25%;
		text-align: center;
	}
	.activite {
		text-decoration:underline
	}
	.img1{
		width: 40px;
		height: 40px;
		margin: 10rpx auto;
	}
	 
</style>
